import React, { Component } from 'react';
import { connect } from 'react-redux';
import { SimpleLineIcons } from '@expo/vector-icons';

import { colors } from '../utils/constants';

import { toNewTweetSreen } from '../actions/nav';
import { ToolbarButton } from '../components/common';

class NewTweetActionButton extends Component {
  render() {
    return (
      this.props.isAuthenticated ?
      <ToolbarButton onPressed={this.props.toNewTweetSreen}>
        <SimpleLineIcons size={20} color={colors.PRIMARY} name="pencil" />
      </ToolbarButton>
      : null
    );
  }
}

const mapStateToProps = state => ({
  isAuthenticated: state.user.isAuthenticated
});

export default connect(mapStateToProps, { toNewTweetSreen })(NewTweetActionButton);
